<!doctype html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="/scripts/jquery.min.js"></script>
    <script src="/scripts/semantic.min.js"></script>
    <link rel="stylesheet" href="/styles/semantic.min.css">
    <title>添加板块</title>
</head>
<body>
<form  method="post" class="ui form" id="category-form" action="/category/save">
    <div class="field">
        <label>Name</label>
        <input type="text" name="name" placeholder="请输入版块名称" autocomplete="off">
    </div>
    <div class="ui error message"></div>
    <input type="button" value="添加" class="ui button" onclick="addCategory()">
</form>
</body>
<script>
    $('#category-form').form({
        fields:{
            name:{
                identifier:'name',
                rules:[
                    {
                        type:'empty',
                        prompt:'版块名称不能为空'
                    }
                ]
            }
        }
    });

    function addCategory() {
        $('#category-form').form('validate form');
        if($('#category-form').form('is valid')){
            $('#category-form').submit();
        }
    }
</script>
</html>